<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Tree</title>
    <link rel="stylesheet" type="text/css" href="ext-4.2.1.883/resources/css/ext-all.css">
    <script type="text/javascript" src="ext-4.2.1.883/ext-all.js"></script>
    <script type="text/javascript" src="ext-4.2.1.883/locale/ext-lang-zh_CN.js"></script>
</head>


<body>

    <script>
        var store = Ext.create('Ext.data.TreeStore',{
            root:{
                expanded:true,
                children:[
//                    {text:"detention", leaf:true},
//                    {text:"homework", expanded:true, children:[
//                        {text:"book report",leaf:true},
//                        {text:"algebra",leaf:true}
//                    ]},
//                    {text:"buy lottery tickets",leaf:true}
                    {text:"", children:[
                        {text:"detention", leaf:true},
                        {text:"homework", expanded:true, children:[
                            {text:"book report",leaf:true},
                            {text:"algebra",leaf:true}
                         ]},
                        {text:"buy lottery tickets",leaf:true}
                    ]}
                ]
            }
        });

        Ext.create('Ext.tree.Panel',{
            title:'目录管理',
            store:store,
            rootVisible:false,
            viewConfig:{
                plugins:{
                    ptype:'treeviewdragdrop'
                }
            },
            renderTo:Ext.getBody()
        });
    </script>


</body>
</html>